<template>
	<view>
		<view class="allBody" v-for="(item,index) in data">
			<view>
				<image class="headImg" :src="item.avatarUrl" v-if="item.role=='pending'"></image>
			</view>
			<view class="title" >
				<text v-if="item.role=='pending'">{{item.realname}}</text>
			</view>
			<view class="text" >
				<text v-if="item.role=='pending'">申请参加{{actdata.name}}</text>
			</view>
			<view class="time" >
				<text v-if="item.role=='pending'">{{time}}</text>
			</view>
			<view >
				<button class="button_yes" @click="arrgee(item)">同意</button>
			</view>
			<view >
				<button class="button_no" @click="refuse(item)">拒绝</button>
			</view>
			<view class="bottomLine"></view>
		</view>
	</view>
</template>

<script>
	export default {
		name:"examineCard",
		props:{
			src:'',
			actid:'',
			actdata:{},
			
			data:[],
		},
		data() {
			return {
			time:'',
			id:'',
			};
		},
		methods:{
			arrgee(item){
				let id=item.id			
				let that=this
				uni.showModal({
					title: '你确定要同意该用户吗',
					success: function (res) {
						item.role='members'
						if (res.confirm) {
							uni.request({
									method:'POST',
									url:'https://www.codingyt.com/club/userEvent/update',
									data: {
									    "userId": id,
									    "eventId": that.actid,
									    "role": "members"  
									},
									success(res) {
										
									}
								})
							
						} else if (res.cancel) {
							
						}
					}
				});
			},
			refuse(item){
				let id=item.id
				// console.log(this.actid);
				let that=this
				uni.showModal({
					title: '你确定要拒绝该用户吗',
					success: function (res) {
						if (res.confirm) {
							uni.request({
									method:'POST',
									url:'https://www.codingyt.com/club/userEvent/delete',
									data: {
									    "userId": id,
									    "eventId": that.actid,
									},
									success(res) {
										console.log(res.data);
									}
								})
							
						} else if (res.cancel) {
							
						}
					}
				});
			},
		}
	}
</script>

<style scoped>
	.allBody{
		height: 200rpx;
		margin-top: 20px;
	}
	.headImg{
		left: 10rpx;
		top: 56rpx;
		width: 116rpx;
		height: 116rpx;
		border-radius: 82rpx;
		position: relative;
	}
	.title{
		left: 154rpx;
		top: -66rpx;
		width: 120rpx;
		height: 52rpx;
		color: rgba(16, 16, 16, 100);
		font-size: 30rpx;
		text-align: left;
		  ;
		position: relative;
	}
	.text{
		left: 154rpx;
		top: -70rpx;
		width: 252rpx;
		height: 70rpx;
		color: rgba(155, 155, 155, 100);
		font-size: 28rpx;
		text-align: left;
		  ;
		position: relative;
		overflow: hidden;
		text-overflow: ellipsis;/*溢出显示省略号*/
		white-space:nowarp;/*强制在一行显示*/
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;  
	}
	.time{
		left: 288rpx;
		top: -182rpx;
		width: 102rpx;
		height: 34rpx;
		color: rgba(155, 155, 155, 100);
		font-size: 24rpx;
		text-align: left;
		  ;
		position: relative;
	}
	.button_yes{
		left: 116rpx;
		top: -193rpx;
		width: 130rpx;
		height: 55rpx;
		line-height: 57rpx;
		border-radius: 28rpx;
		background-color: rgba(245, 166, 35, 100);
		color: rgba(255, 255, 255, 100);
		font-size: 24rpx;
		text-align: center;
		font-family: Arial;
		position: relative;
	}
	.button_no{
		left: 270rpx;
		top: -245rpx;
		width: 130rpx;
		height: 55rpx;
		line-height: 57rpx;
		border-radius: 28rpx;
		background-color: rgba(238, 95, 24, 100);
		color: rgba(255, 255, 255, 100);
		font-size: 24rpx;
		text-align: center;
		font-family: Arial;
		position: relative;
	}
	.bottomLine{
		left: -20rpx;
		top: -150rpx;
		width: 750rpx;
		height: NaNpx;
		border: 2rpx solid rgba(187, 187, 187, 100);
		position: relative;
		padding-bottom: -200rpx;
	}
</style>
